<template>
	<div id="customerDetailsTracing" class="customerDetailsTracing">
		<div style="text-align: center;margin-top: 20px">
			<div style="font-size: 22px; font-weight: bold; float: left; margin-left: 12px;z-index: 99">
				最新动态
			</div>
			<div style="text-align: right">
				<x-button mini class="tracingBtn" @click.native="switchshow">新建</x-button>
			</div>
		</div>

		<div class="tracePopup" v-transfer-dom>
			<popup v-model="show" height="270px" is-transparent>
				<div style="width: 95%;background-color:#fff;margin:0 auto;padding-bottom: 5px">
					<group>
						<x-textarea :max="200" :placeholder="hint"  v-model="detail" :height="50" ></x-textarea>
					</group>
					<flexbox>
						<flexbox-item>
							<x-button type="primary" style="width: 80%" @click.native="submitTrace">确定</x-button>
						</flexbox-item>
						<flexbox-item>
							<x-button type="warn" @click.native="cancelTrace" style="width: 80%">取消</x-button>
						</flexbox-item>
					</flexbox>
				</div>
			</popup>
		</div>

		<div style="margin-top: 220px">
			<CustomerTraceList :curURL="curUrl" ref="scroller" :delRestURL="delRestURL"></CustomerTraceList>
		</div>

	</div>
</template>

<script>
	import { Group, Cell, Popup, XButton, TransferDom, XTextarea, Flexbox, FlexboxItem } from 'vux'
	import CustomerTraceList from '../../../../components/mobile/scroller/scrollerTrace'
	import NetWorking from '../../../../utils/networking'

	export default {
		name: "customer-details-tracing",
		components: {
			Group,
			Cell,
			Popup,
			XButton,
			XTextarea,
			Flexbox,
			FlexboxItem,
			CustomerTraceList
		},
		directives: {
			TransferDom
		},
		data()
		{
			return {
				delRestURL: 'customertrace',
				curUrl: 'customertrace/pages/' + this.$route.params.id,
				detail:'',
				hint:'添加新动态',
				show: false,
				addeditem: {}
			}
		},
		computed:{
			activecss:function(){
				if(this.detail == null ||  this.detail.replace(/^\s+|\s+$/g, "").length ==0)
				{
					return true
				}
				else
				{
					return false
				}
			}
		},
		methods: {
			switchshow () {
				this.show = true
			},
			submitTrace: function () {
				let _this = this
				let addeditem = {}
				addeditem.content = this.detail
				addeditem.customer_id  = this.$store.state.customer.customer.id
				NetWorking.doPost(
					'customertrace',
					null,
					null,
					{
						params: {
							content:    this.detail ,
							customerId: this.$route.params.id,
							file_id: ''
						}
					}
				).then(
					response => {
						let rs = response.data
						if(rs.error_code == 0){
							//_this.$router.replace({ name: 'customerDetails', params: { id: rs.customer_id }})
							//window.location.href = "/apps/mavinTeachers.html#/customer";
							_this.detail = ''
							_this.show   = false
							_this.$refs.scroller.triggerrefresh()
							//addeditem.id = rs.id
							//_this.addeditem = addeditem
						}else{
							alert(rs.error_message);
						}
					}
				)

				this.$emit('showTabbar',true)
			},
			cancelTrace:function()
			{
				this.detail = ''
				this.show   = false
				this.$emit('showTabbar',true)
			}
		}
	}

</script>

<style scoped>

	.tracingBtn {
		z-index: 99;
		background-color: #efae1b;
		color: white;
		margin-right: 10px;
	}

	.tracePopup > .vux-popup-dialog {
	}

	.cell-x-icon {
		display: block;
		fill: orange;
		text-align: center;
		margin-top: 10px;
	}

	.buttonCustomerTrace {
		border-radius: 25px;
		margin-top: 15px;
	}

</style>
